<template>
    <div>
        <a-form ref="formRef"
            :label-col="{ span: 6 }"
            :wrapper-col="{ span: 18 }"
            class="" 
            :model="editRecordInfo">
            <a-form-item label="类型">
                <a-select v-model:value="editRecordInfo.type" style="width: 100%" ref="select" :defaultActiveFirstOption="true">
                    <a-select-option v-for="typev in typeList" :key="typev" :value="typev">{{typev}}</a-select-option>
                </a-select>
            </a-form-item>
            <a-form-item label="标题">
                <a-input v-model:value="editRecordInfo.title"></a-input>
            </a-form-item>
            <a-form-item label="内容">
                <a-input v-model:value="editRecordInfo.content"></a-input>
            </a-form-item>
            <a-form-item label="备注">
                <a-input v-model:value="editRecordInfo.mark"></a-input>
            </a-form-item>
        </a-form>
        <div style="text-align:center" id="components-button-demo-basic">
            <a-button type="default" @click="cancel">取消</a-button>
            <a-button type="primary" @click="save">确认</a-button>
        </div>
    </div>
</template>
<script setup lang="ts">
import service from '@/axios';
import { onMounted, reactive } from 'vue';
    const emit = defineEmits(['save','cancel'])
    const props = defineProps({
        record:{} as any,
    })
    let editRecordInfo = reactive({
        type:'工作',
        title:'',
        content:'',
        mark:''
    })

    const typeList = ['工作','生活','学习']

    onMounted(()=>{
        debugger
        editRecordInfo = Object.assign(editRecordInfo,props.record)
    })

    const cancel = function(){
        emit('cancel')
    }

    const save =function(){
        service.post('/record/addRecord',editRecordInfo).then(res=>{
            emit('save')
        })
    }
</script>
<style scoped>
</style>